<%@ page language="java"  pageEncoding="UTF-8"%>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/zui.uploader.css">
<div class="panel ">
	 <div class="panel-heading">
	   	查询区域
	 </div>
	 <div class="panel-body row">
	 	<div class="row">
	 		<div class="col-md-4">
	 			<div class="input-group ">
					  <span class="input-group-addon">用户名</span>
					  <input type="text" class="form-control" id="queryUserName" name="queryUserName">
				</div>
	 		</div>
	 		<div class="col-md-4">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">用户状态</span>
			 	  <select  class="form-control" id="queryUserState" name="queryUserState">
			 	  	<option value="">请选择</option>
			 	  </select>
				</div>
	 		</div>
	 		<div class="col-md-4">
			    <button class="btn btn-success" type="button" id="searchBtn"><i class="icon-search"></i>搜索</button>
	 		</div>
	 	</div>
	 </div>
 </div>
 <div class="datagrid">
  <div class="search-box ">
  	<button class="btn btn-success " type="button"
  	  data-toggle="modal" data-target="#addModal" id="addBtn"><i class="icon-plus"></i>新增</button>
  	  &nbsp;&nbsp;&nbsp;&nbsp;
  	<button class="btn btn-info " type="button" id="updateBtn"><i class="icon icon-edit"></i>修改</button>
    	&nbsp;&nbsp;&nbsp;&nbsp;
    <button class="btn btn-danger " type="button" id="deleteBtn"><i class="icon icon-trash"></i>删除</button>
    	&nbsp;&nbsp;&nbsp;&nbsp;
    <button class="btn " type="button" id="detailBtn"><i class="icon icon-info"></i>详情</button>
  </div>
  <div id="listDataGrid" class="datagrid-container datagrid-striped" data-ride="datagrid"></div>
  <div  class="pager" id="listPager" align="right"></div>
</div>
<!-- 添加页面  -->
<div class="modal fade" id="addModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
        <h4 class="modal-title">新增用户</h4>
      </div>
      <form id="addForm">
      <div class="modal-body">
        <div class="row with-padding">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">用户名<font color="red">*</font></span>
					  <input type="text" class="form-control" id="addUserName" name="addUserName">
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">用户姓名<font color="red">*</font></span>
			 	  <input type="text" class="form-control" id="addTrueName" name="addTrueName">
				</div>
	 		</div>
	 	</div>
        <div class="row with-padding">
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">手机号<font color="red">*</font></span>
			 	  <input type="text" class="form-control" id="addMobile" name="addMobile">
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">登陆密码<font color="red">*</font></span>
					  <input type="password" class="form-control" id="addPasswd" name="addPasswd">
				</div>
	 		</div>
	 	</div>
        <div class="row with-padding">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">性&nbsp;&nbsp;&nbsp;&nbsp;别<font color="red">*</font></span>
					  <div class="form-group  text-center  justify-content-center " id="sexDivId"></div>
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group " >
			 	  <input type="hidden" name="addHobbyValue" id="addHobbyValue">
			 	  <span class="input-group-addon">兴趣爱好<font color="red">*</font></span>
			 	  <div class="form-group text-center  justify-content-center" id="hobbyDivId"></div>
				</div>
	 		</div>
	 	</div>
        <div class="row with-padding">
	 		<div class="col-md-12">
	 			<div class="input-group ">
	 				<span class="input-group-addon">大头像<font color="red">*</font></span>
					<div  id="uploadHeadpic" class="uploader with-padding">
					  <div class="file-list" data-drag-placeholder="请拖拽文件到此处"></div>
					  <button type="button" class="btn btn-primary uploader-btn-browse"><i class="icon icon-cloud-upload"></i> 选择文件</button>
					</div>
					 <input type="hidden" id="addHeadpic" name="addHeadpic">	
				</div>
	 		</div>
	 	</div>
      </div>
      <div class="modal-footer">
      	<input type="hidden" id="action" name="action" value="add">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="submit" class="btn btn-primary"  id="addSave">保存</button>
      </div>
       </form>
    </div>
  </div>
</div>
<!-- 修改页面  -->
<div class="modal fade" id="updateModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
        <h4 class="modal-title">修改用户</h4>
      </div>
      <form id="updateForm">
      <div class="modal-body">
        <div class="row with-padding">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">用户名<font color="red">*</font></span>
					  <input type="text" class="form-control" id="updateUserName" name="updateUserName" readonly="readonly">
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">用户姓名<font color="red">*</font></span>
			 	  <input type="text" class="form-control" id="updateTrueName" name="updateTrueName">
				</div>
	 		</div>
	 	</div>
        <div class="row with-padding">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">性&nbsp;&nbsp;&nbsp;&nbsp;别<font color="red">*</font></span>
					  <div class="form-group  text-center  justify-content-center " id="updateSexDivId"></div>
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group " >
			 	  <input type="hidden" name="updateHobbyValue" id="updateHobbyValue">
			 	  <span class="input-group-addon">兴趣爱好<font color="red">*</font></span>
			 	  <div class="form-group text-center  justify-content-center" id="updateHobbyDivId"></div>
				</div>
	 		</div>
	 	</div>
        <div class="row with-padding">
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">手机号<font color="red">*</font></span>
			 	  <input type="text" class="form-control" id="updateMobile" name="updateMobile">
				</div>
	 		</div>
	 	</div>
        <div class="row with-padding">
	 		<div class="col-md-12">
	 			<div class="input-group ">
	 				<span class="input-group-addon">大头像<font color="red">*</font></span>
					<div  id="uploadHeadpicDiv" class="hide"></div>
					<div id="updateUploadHeadpicDiv2" class="hide">
					<div id="updateUploadHeadpicDiv"  class="uploader with-padding " style="display:none;">
					  <div class="file-list" data-drag-placeholder="请拖拽文件到此处"></div>
					  <button type="button" class="btn btn-primary uploader-btn-browse"><i class="icon icon-cloud-upload"></i> 选择文件</button>
					</div>
					</div>
					<button class="btn btn-primary hide" type="button" id="updateImgChangeBtn" onclick="updateImgChange();">更换图片</button>
				</div>
	 		</div>
	 	</div>
      </div>
      <div class="modal-footer">
      	<input type="hidden" id="updateUserId" name="updateUserId" />
      	<input type="hidden" id="updateHeadpic" name="updateHeadpic" />
        <button type="button" class="btn btn-default " data-dismiss="modal">关闭</button>
        <button type="submit" class="btn btn-primary"  id="updateSave">保存</button>
      </div>
       </form>
    </div>
  </div>
</div>
<!-- 删除确认 -->
<div class="modal fade" id="deleteModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
        <h4 class="modal-title">删除地区</h4>
      </div>
      <div class="modal-body">
        <p>您确定要删除此地区信息吗?</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        <button type="button" class="btn btn-primary" id="deleteAreaBtn">确定</button>
      </div>
    </div>
  </div>
</div>
<!-- 详情页面  -->
<div class="modal fade" id="detailModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">关闭</span></button>
        <h4 class="modal-title">地区详情</h4>
      </div>
      <form id="detailForm">
      <div class="modal-body">
        <div class="row">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">地区编码</span>
					  <span class="form-control"  id="detailAreaCode"></span>
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">地区名称</span>
			 	  <span class="form-control"  id="detailAreaName"></span>
				</div>
	 		</div>
	 	</div>
	 	<div style="margin-top:10px;"></div>
        <div class="row">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">所属地区</span>
					  <span class="form-control"  id="detailAreaParentCode"></span>
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">排序码值</span>
				  <span class="form-control"  id="detailSortNo"></span>
				</div>
	 		</div>
	 	</div>
	 	<div style="margin-top:10px;"></div>
        <div class="row">
	 		<div class="col-md-6">
	 			<div class="input-group ">
					  <span class="input-group-addon">操作人员</span>
					  <span class="form-control"  id="detailOprId"></span>
				</div>
	 		</div>
	 		<div class="col-md-6">
	 			<div class="input-group ">
			 	  <span class="input-group-addon">操作时间</span>
				  <span class="form-control"  id="detailOprDate"></span>
				</div>
	 		</div>
	 	</div>
	 	<div style="margin-top:10px;"></div>
        <div class="row">
	 		<div class="col-md-12">
	 			<div class="input-group ">
					  <span class="input-group-addon">地区描述</span>
				  	  <span class="form-control"  id="detailDescription"></span>
				</div>
	 		</div>
	 	</div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default " data-dismiss="modal">关闭</button>
      </div>
    </form>
    </div>
  </div>
</div>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/config.js?version=2"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.validate.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/localization/messages_zh.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/zui.uploader.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/js/user2.js?version=1"></script>